.header {
    height: 1.33rem
        /* 50/37.5 */
    ;
    background-color: skyblue;
    display: flex;
    justify-content: space-between;
    line-height: 1.33rem;

    a {
        color: #fff;
        font-size: 20px;
        margin-left: 8px;
    }

    span {
        color: #fff;
        font-style: 20px;
    }

    img {
        width: .91rem
            /* 34/37.5 */
        ;
        height: .91rem
            /* 34/37.5 */
        ;
        margin: 8px;
    }
}


.nav {
    overflow: scroll;
    border-bottom: 3px solid rgba(0, 0, 0, 0.2);

    &::-webkit-scrollbar {
        display: none;
    }

    ul {
        display: flex;
        flex-wrap: nowrap;
        overflow: hidden;
        width: 300%;
        justify-content: space-around;

        li {
            height: .96rem
                /* 36/37.5 */
            ;
            line-height: 0.96rem;

            a {
                font-size: 14px;
                color: #000;
            }
        }
    }
}

.content {
    ul {
        li {
            border-bottom: 3px solid rgba(0, 0, 0, 0.2);
            display: flex;

            img {
                width: 130px;
                height: 130px;
                margin: 8px 5px;
            }

            div.right {
                h4 {
                    font-size: 18px;
                    font-weight: 400;

                    span {
                        color: skyblue;
                        font-size: 18px;
                    }
                }

                p.price {
                    font-size: 24px;
                    color: orange;

                    em {
                        font-style: normal;

                        font-size: 12px;
                    }

                    del {
                        font-size: 12px;
                        color: #ccc;
                    }

                    i {
                        font-size: 16px;
                        color: orange;
                    }
                }

                

                div.barp{
                    color: orange;
                    font-size: 12px;
                    font-weight: bold;
                    span{
                        font-size: 12px;
                        color: orange;
                        font-weight: bold;
                    }
                    div.bar {
                        display: inline-block;
                        i {
                            border: 1px solid orange ;
                            display: inline-block;
                            height: .59rem /* 22/37.5 */;
                            line-height: 22px;
                            width: 3.2rem
                                /* 120/37.5 */
                            ;
                            background-color: #ffb7b7;
                            border-radius: 10px;
                            span {
                                border-radius: 10px;
                                width: 0px;
                                display: block;
                                text-align: center;
                                color: #fff;
                                background-color: orange;
                            }
                        }
                        b{
                            margin-left: 5px;
                            font-weight: bold;
                            color: orange;
                            font-size: 12px;
                        }
                    }
                }
                p{
                    margin-top: 10px;
                    span{
                        display: inline-block;
                        width: 4rem /* 150/37.5 */;
                        text-align: center;
                        border: 1px dashed #ffb7b7;
                        color: orange;
                    }
                    a{
                        display: inline-block;
                        background-color: orange;
                        color: #fff;
                        margin-left: 10px;
                        padding: 5px 10px;
                        font-size: 12px;
                        border-radius: 10px;
                    }
                }
            }
        }
    }
}

.footer {
    background-color: #f4f4f4;

    .more {
        padding: 10px;
        text-align: center;

        a {
            display: block;
            width: 100%;
            height: .85rem
                /* 32/37.5 */
            ;
            line-height: .85rem
                /* 32/37.5 */
            ;
            border: 1px solid rgba(0, 0, 0, 0.2);
            border-radius: 8px;
            background-image: linear-gradient(#ffffff, #f4f4f4);
        }
    }

    .chart {
        background-color: skyblue;

        span {
            width: 3.2rem
                /* 120/37.5 */
            ;
            height: .93rem
                /* 35/37.5 */
            ;
            font-size: 20px;
            line-height: .93rem
                /* 35/37.5 */
            ;
            color: #ffffff;
            margin-left: 10px;
            font-family: "微软雅黑", sans-serif;
        }
    }

    ul {
        display: flex;
        margin-top: 10px;

        li {
            flex: 1;
            text-align: center;
            font-size: 14px;
            border: 1px solid rgba(0, 0, 0, 0.2);
            height: .88rem
                /* 33/37.5 */
            ;
            line-height: .88rem
                /* 33/37.5 */
            ;
        }
    }

    p {
        font-size: 12px;
        line-height: 32px;
        text-align: center;
    }
}